<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
.box-base{
    width: 500px;
    height: 400px;
    margin: 0;
    padding-top:40px;
}
.box{
    width: 300px; /**宽度**/
    height: 100px; /**高度**/
    background: #dbe6ed; /**背景色**/
    text-align: center;
    box-sizing: border-box ;
}
.div:hover {
    margin-left: -40px;
}

</style>
<body>
<section class="box-base">
    <div class="div"> 鼠标放上去收缩</div>
    <div class="boxA">盒模型</div>

</section>

<section class="box">
<div class="123">123 </div>
</section>
</body>
</html>